/*单行文本的溢出显示省略号*/
.p1 {
  overflow: hidden;
  text-overflow: ellipsis;
  background: rgb(232, 231, 229);
  white-space: nowrap; /*加宽度width属来兼容部分浏览*/
  border-radius: 1em;
  padding: 1em;
}

/*多行文本溢出显示省略号*/
#p2 {
  height: 58px;
  line-height: 58px;
  padding: 1px;
  border-radius: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  background: rgb(238, 252, 238);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  /*-webkit-line-clamp用来限制在一个块元素显示的文本的行数。 为了实现该效果，它需要组合其他的WebKit属性。常见结合属性：
  display: -webkit-box; 必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。
  -webkit-box-orient 必须结合的属性 ，设置或检索伸缩盒对象的子元素的排列方式 。*/
}

.createTitle {
  display: flex;
  margin-bottom: 1em;
  align-items: center;
}

/*******************loading  css样式****************/
.wrapp_loading {
  position: fixed;
  top: 50%;
  left: 50%;
  height: 100px;
  margin: 0 10px 10px 0;
  padding: 20px 20px 20px;
  border-radius: 5px;
  text-align: center;
}
.k-line {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  background: #01fef9;
  /* background-color:#4b9cdb */
}
.k-line11-1 {
  animation: k-loadingP 2s infinite;
}
.k-line11-2 {
  animation: k-loadingP 2s infinite;
  animation-delay: 0.15s;
}
.k-line11-3 {
  animation: k-loadingP 2s infinite;
  animation-delay: 0.3s;
}
.k-line11-4 {
  animation: k-loadingP 2s infinite;
  animation-delay: 0.45s;
}
.k-line11-5 {
  animation: k-loadingP 2s infinite;
  animation-delay: 0.6s;
}
@keyframes k-loadingP {
  0% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    /* Safari and Chrome */
    -moz-transform: translateY(0);
    /* Firefox */
    -o-transform: translateY(0);
    /* Opera */
  }
  35% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    /* Safari and Chrome */
    -moz-transform: translateY(0);
    /* Firefox */
    -o-transform: translateY(0);
    /* Opera */
    opacity: 0.3;
  }
  50% {
    transform: translateY(-20px);
    -webkit-transform: translateY(-20px);
    /* Safari and Chrome */
    -moz-transform: translateY(-20px);
    /* Firefox */
    -o-transform: translateY(-20px);
    /* Opera */
    opacity: 0.8;
  }
  70% {
    transform: translateY(3px);
    -webkit-transform: translateY(3px);
    /* Safari and Chrome */
    -moz-transform: translateY(3px);
    /* Firefox */
    -o-transform: translateY(3px);
    /* Opera */
    opacity: 0.8;
  }
  85% {
    transform: translateY(-3px);
    -webkit-transform: translateY(-3px);
    /* Safari and Chrome */
    -moz-transform: translateY(-3px);
    /* Firefox */
    -o-transform: translateY(-3px);
    /* Opera */
  }
}
/*******************loading  css样式****************/
